import QtQuick 2.12
import QtQuick.Controls 2.12
import QtQuick.Dialogs 1.2
import "base"

Item {

    ListModel {
        id: faceModel
    }

    Column {
        anchors.top: parent.top
        anchors.left: parent.left
        anchors.margins: 5
        spacing: 10
        Row {
            id: selectSTEP
            spacing: 10
            MyButton {
                height: 35
                width: 35
                Image {
                    source: "qrc:/resource/icon_add.svg"
                    anchors.fill: parent
                    anchors.margins: 5
                }
                onClicked: {
                    fileDialog.open()
                }
            }
            TextArea {
                id: stepFilePath
                height: 35
                width: 400
                enabled: false
                font.family: Common.fontMain
                font.pixelSize: 14
                placeholderText: "请导入STEP格式三维模型!"
                background: MyRectangle {

                }
            }
        }
        Text {
            text: "已选择的面: "
            font.family: Common.fontMain
            font.pixelSize: 16
            color: Common.colorMain
        }
        Grid {
            columnSpacing: 10
            rowSpacing: 10
            Repeater {
                model: faceModel
                Rectangle {
                    id: customBubble
                    radius: height / 2
                    border.color: Common.colorMain
                    border.width: 1
                    height: 35
                    width: 100
                    Text {
                        id: detail
                        text: "面" + faceID
                        anchors.left: parent.left
                        anchors.right: closeBumble.left
                        anchors.margins: 2
                        font.family: Common.fontMain
                        font.pixelSize: 12
                        color: Common.colorMain
                        height: parent.height
                        verticalAlignment: Text.AlignVCenter
                        horizontalAlignment: Text.AlignHCenter
                    }
                    Image {
                        id: closeBumble
                        height: parent.height
                        width: height
                        source: "qrc:/resource/icon_close.svg"
                        anchors.right: parent.right
                        scale: 0.7
                        MouseArea {
                            anchors.fill: parent
                            hoverEnabled: true
                            onEntered: parent.scale = 0.6
                            onExited: parent.scale = 0.7
                            onClicked: {
                                faceModel.remove(index)
                            }
                        }
                    }
                }
            }
        }
    }

    Row {
        anchors.bottom: parent.bottom
        anchors.left: parent.left
        anchors.margins: 5
        spacing: 10
        MyButton {
            height: 35
            width: 100
            text: "完成选面"
        }
        MyButton {
            height: 35
            width: 100
            text: "匹配计算"
        }
        Item {
            height: 10
            width: 20
        }
        Text {
            text: "零件分散度" + stepSlider.value + "%"
            font.family: Common.fontMain
            font.pixelSize: 12
            color: Common.colorMain
            anchors.verticalCenter: parent.verticalCenter
            width: 80
        }
        MySlider {
            id: stepSlider
            width: 150
            from: 0
            to: 100
            stepSize: 10
            snapMode: Slider.SnapAlways
            anchors.verticalCenter: parent.verticalCenter
            onValueChanged: {
                ViewBridge.setSTEPSlide(value)
            }
        }
    }

    FileDialog {
        id: fileDialog
        title: "请选择STEP模型文件"
        nameFilters: ["*.stp; *.step"]
        selectMultiple: false
        modality: Qt.WindowModal
        onAccepted: {
            var selectedFile = fileDialog.fileUrl
            stepFilePath.text = selectedFile.toString().replace("file:///", "")
            ViewBridge.readSTEP(stepFilePath.text)
        }
        onRejected: {
            console.log("文件选择被取消")
        }
    }

    Connections {
        target: ViewBridge
        onFaceSelected: {
            faceModel.append({"faceID": faceID})
        }
    }
}
